<template>
  <section id="cashPage">
    <el-row style="line-height: 30px;padding-bottom: 10px;">
      <!--<el-col :span="5" class='flex'>-->
        <!--<span style='white-space:nowrap '>提现时间：</span>-->
        <!--<div class="block" style="flex: 1">-->
          <!--<el-date-picker-->
            <!--v-model="value1"-->
            <!--type="datetime"-->
            <!--placeholder="选择日期时间">-->
          <!--</el-date-picker>-->
        <!--</div>-->
      <!--</el-col>-->
      <!--<el-col :span="5" class='flex'>-->
        <!--<span style='white-space:nowrap;padding: 0 8px'>至</span>-->
        <!--<div class="block" style="flex: 1">-->
          <!--<el-date-picker-->
            <!--v-model="value1"-->
            <!--type="datetime"-->
            <!--placeholder="选择日期时间">-->
          <!--</el-date-picker>-->
        <!--</div>-->
      <!--</el-col>-->


      <!--<el-col :span="4" style="text-align: left;padding-left: 10px">-->
        <!--<el-button type="primary" size="mini">查询</el-button>-->
      <!--</el-col>-->
    </el-row>

    <el-table :data="tableData.list" v-loading="loading" stripe style="width: 100%">
      <el-table-column type="index">
      </el-table-column>
      <!--<el-table-column prop="nickName" label="昵称">-->
      <!--</el-table-column>-->
      <el-table-column prop="amount" label="提现金额">
      </el-table-column>
      <el-table-column prop="cardBank" label="银行名称"  width="120">
      </el-table-column>
      <el-table-column prop="cardNumber" label="银行卡号"  width="160">
      </el-table-column>
      <el-table-column prop="cardPerson" label="持卡人姓名"  width="100">
      </el-table-column>
      <el-table-column prop="cardPhone" label="手机号"  width="120">
      </el-table-column>
      <el-table-column prop="createTime" label="创建时间" width="160">
      </el-table-column>
      <el-table-column prop="finishTime" label="完成时间"  width="160">
      </el-table-column>
      <el-table-column  label="状态">
        <template slot-scope="scope">
          <div v-if="scope.row.status == 0">成功</div>
          <div v-if="scope.row.status == 1">失败</div>
          <div v-if="scope.row.status == 2">等待</div>
        </template>
      </el-table-column>
    </el-table>
    <div class="block" style="text-align: right;padding: 10px;">
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page.sync="tableData.pageNumber"
        :page-size="tableData.pageSize"
        layout="total, prev, pager, next"
        :total="tableData.totalRow">
      </el-pagination>
    </div>
  </section>
</template>

<script>
  import judgeTime from '../../../../assets/js/index.js'

  export default {
    data () {
      return {
        value1: '',
        options: [],
        value: '',
        tableData: {},
        loading: false,
        page: {
          pageSize: 10,
          pageNumber: 1
        }
      }
    },
    beforeMount () {
      this.getTableData()
    },
    methods: {
      getTableData () {
        this.loading = true
        this.$api.getCashList(this.page).then(res => {
          this.loading = false
          this.tableData = res.data
          for (let i = 0; i < this.tableData.list.length; i++) {
            this.tableData.list[i].createTime = judgeTime(this.tableData.list[i].createTime)
            this.tableData.list[i].finishTime = judgeTime(this.tableData.list[i].finishTime)
            console.log(this.tableData.list[i].createTime)
          }
        })
      },
      handleCurrentChange (val) {
        this.page.pageNumber = val
        this.getTableData()
      }
    }

  }
</script>

<style lang="less">
  #cashPage {

    .el-input__inner {
      height: 30px;
      line-height: 30px;
      width: 100%;
      padding-right: 0;
      font-size: 12px;
      padding-left: 20px;
    }
    .el-input {
      width: 100% !important;
    }
    .el-input__icon {
      line-height: inherit;
      width: 0;
    }
    .el-input__suffix {
      right: 20px;
    }
  }
</style>
